/**
 * 运动后回调函数版
 * 
 */
 function linear(t, b, s, d) {
    return s / d * t + b;
}
function animate(ele, attr, target, duration = 2000, fn) {
    // clearInterval(ele.timer);
    if (ele.timer) {
        return;
    }
    var t = 0;// 运动的时间
    var timeStep = 10; // 运动的时间间隔
    // 使用css函数获取当前位置
    var begin = utils.css(ele, attr); // 获取开始位置并转化成数字
    var s = target - begin;// 运动总路程
    ele.timer = setInterval(() => {
        // 1. 累加时间间隔
        t += timeStep;
        // 2. 判断停止条件
        if (t >= duration) {
            // 1 。到达目标位置后，清除定时器
            clearInterval(ele.timer);
            // 2. 让位置就是目标位置   使用css函数设置最新位置
            utils.css(ele, attr, target);
            // 清掉ele.timer,否则回调函数不能执行，在第11行会return
            ele.timer = null;
            fn && fn.apply(this, arguments);
            return;
        }
        // 3. 给元素属性赋值
        var curPos = linear(t, begin, s, duration);
        // 使用css函数设置最新位置
        utils.css(ele, attr, curPos);
    }, timeStep);
}